<template>
  <div class="app-container-custom">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="费用类型" prop="projectId">
        <el-select v-model="queryParams.projectId" placeholder="费用类型" clearable size="small">
          <el-option v-for="item in sfProList" :key="item.projectId" :label="item.projectType"
            :value="item.projectId" />
        </el-select>
      </el-form-item>
      <el-form-item label="收费项目" prop="chargeId">
        <el-select v-model="queryParams.chargeId" placeholder="收费项目" clearable size="small">
          <el-option v-for="item in sfList" :key="item.chargeId" :label="item.chargeName"
            :value="item.chargeId" />
        </el-select>
      </el-form-item>
      <el-form-item label="收费标准" prop="normId">
        <el-select v-model="queryParams.normId" placeholder="收费标准" clearable size="small">
          <el-option v-for="item in sfBzList" :key="item.normId" :label="item.normNames"
            :value="item.normId" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['payfee:roomNorm:add']"
        >标准设置
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['payfee:roomNorm:edit']"
        >修改
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['payfee:roomNorm:remove']"
        >删除
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="roomNormList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center"/>
      <!--<el-table-column label="组织机构" align="center" prop="deptName" width="180"/>-->
      <el-table-column label="房屋名称" align="left" prop="roomName" width="200">
        <template slot-scope="scope">
          <!--<span>{{scope.row.communityName}}-{{scope.row.roomName}}</span>-->
          <span>{{scope.row.roomName}}</span>
        </template>
      </el-table-column>
      <el-table-column label="费用类型" align="left" prop="feeCondition.projectType" width="120"/>
      <el-table-column label="收费项目" align="left" prop="feeCondition.chargeName" width="180"/>
      <el-table-column label="收费标准" align="left" prop="feeCondition.normNames" width="180"/>
      <el-table-column label="开始收费时间" align="center" prop="beginChargeTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.beginChargeTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="结束收费时间" align="center" prop="finishChargetime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.finishChargetime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="下一次计费开始时间" align="center" prop="beginChargeTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.nextBeginChargeTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="下一次计费结束时间" align="center" prop="finishChargetime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.nextFinishChargetime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="交讫年月" align="center" prop="deliveryTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.deliveryTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="指定金额" align="center" prop="amountSpecified" width="150"/>
      <el-table-column label="备注" align="center" prop="remark" width="150" show-overflow-tooltip/>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <room-norm-add ref="addRef" @cancel="getList"/>

    <room-norm-update ref="udpateRef" @cancel="getList"/>

  </div>
</template>

<script>
  import { listRoomNorm, delRoomNorm, } from "@/api/payfee/roomNorm";
  import RoomNormAdd from "@/views/payfee/roomNorm/add";
  import RoomNormUpdate from "@/views/payfee/roomNorm/update";
  import { listMixin} from "@/utils/mixins/listMixin";
  import { listItem} from "@/api/payfee/item";
  import { listProject} from "@/api/payfee/project";
  import { listNorm} from '@/api/payfee/norm';

  export default {
    name: "RoomNorm",
    components: {RoomNormUpdate, RoomNormAdd},
    mixins:[ listMixin ],
    data() {
      return {
        // 房屋收费标准表格数据
        roomNormList: [],
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          projectId: null,
          chargeId: null,
          normId: null,
          nodeId: null,
          status:'10001'
        },
        sfList: [],
        sfProList: [],
        sfBzList: [],
      };
    },
    watch:{
      currentNode(v){
        this.getList()
      }
    },
    created() {
      this.getList();
      this.getSfItem();
      this.getSfProhect();
      this.getSfBz();
    },
    methods: {
      /** 查询房屋收费标准列表 */
      getList() {
        this.loading = true;
        this.queryParams.nodeId = this.currentNode.id
        listRoomNorm(this.queryParams).then(res => {
          this.roomNormList = res.rows
          this.total = res.total
          this.loading = false;
        });
      },
      /** 获取收费项目列表 */
      getSfItem() {
        listItem().then(response => {
          this.sfList = response.rows;
        })
      },
      /** 获取收费类型 */
      getSfProhect() {
        listProject().then(response => {
          this.sfProList = response.rows;
          console.log(this.sfProList);
        })
      },
      /** 获取收费标准 */
      getSfBz() {
        listNorm().then(response => {
          this.sfBzList = response.rows;
        })
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
        this.getList();
      },
      /** 多选框选中数据 */
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.roomNormId)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.$refs.addRef.show({currentNode: this.currentNode})
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        const roomNormId = row.roomNormId || this.ids
        this.$refs.udpateRef.show(roomNormId)
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const roomNormIds = row.roomNormId || this.ids;
        this.$confirm('是否确认删除房屋收费标准编号为"' + roomNormIds + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function () {
          return delRoomNorm(roomNormIds);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(() => {
        });
      }
    },
    props: {
      currentNode: {
        type: Object,
        default: ()=>{}
      },
    }
  };
</script>
